<template>
    <!-- 页面状态 -->
    <view >
            <view class="payment-result p-[20rpx]">
                <view class="result bg-white p-[20rpx] rounded-md">
                    <view class="flex flex-col items-center my-[40rpx]">
                        <!-- 支付状态图片 -->
                        <u-image
                            class="status-image"
                            src="/static/images/payment/icon_waiting.png"
                            width="100"
                            height="100"
                            shape="circle"
                        />
                        <!-- 支付状态文字 -->
                        <text class="text-2xl font-medium mt-[20rpx]">
							查询失败-{{msg}}
						</text>
                       
                    </view>

				
				</view>
                <view class="mt-[40rpx]">
                    <view class="mb-[20rpx]">
                        <u-button
                            type="success"
                            shape="circle"
                            hover-class="none"
                            @click="goOrder"
                        >
                            重新查询
                        </u-button>
                    </view>
                    <view class="mb-[20rpx]">
                        <u-button
                            type="success"
                            plain
                            shape="circle"
                            hover-class="none"
                            @click="goHome"
                        >
                            返回首页
                        </u-button>
                    </view>
                </view>
            </view>
        
    </view>
</template>

<script lang="ts" setup>

import { onLoad } from '@dcloudio/uni-app'
import { computed, reactive, ref } from 'vue'
const msg = ref("");

const goHome = () => {
    uni.reLaunch({
        url: '/pages/index/index'
    })
}

const goOrder = () => {
	uni.navigateBack();
}

onLoad(async (options: any) => {
   msg.value = options.msg || ''
})
</script>

<style lang="scss" scoped>
.result-info {
    .result-info__item {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20rpx;
    }
}
</style>
